import 'dart:io';

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';

import '../utils/style/color_style_theme.dart';
import '../utils/style/text_style_theme.dart';

///@author Cc
///标题栏
class CustomAppBar extends PreferredSize {
  ///显示的标题栏Widget
  final Widget? childView;

  ///标题
  final String title;

  ///是否显示左边的按钮
  final bool showLeftButton;

  ///返回的回调
  final Function? callPopBack;

  ///设置右边的显示区域Widget
  final Widget? rightWidget;

  ///显示底部的线
  final bool? showBottomLine;

  ///背景颜色
  final int? backGroundColor;

  ///标题的样式
  final TextStyle? titleTextStyle;

  ///左边按钮颜色
  final Color? btnColor;

  ///关闭按钮的样式设定
  final String? closeSvg;

  final num? heightBar;

  CustomAppBar({
    required this.title,
    this.callPopBack,
    this.childView,
    this.rightWidget,
    this.backGroundColor,
    this.titleTextStyle,
    this.btnColor,
    this.closeSvg,
    this.heightBar = 0.0,
    this.showLeftButton = true,
    this.showBottomLine = true,
  }) : super(
    preferredSize: Size.fromHeight((Platform.isIOS
        ? (heightBar == 0.0 ? 44.0 : heightBar)
        : (heightBar == 0.0 ? kToolbarHeight : heightBar)) as double),
    child: childView ?? const SizedBox(),
  );

  @override
  Widget build(BuildContext context) {
    Widget current = childView ?? const SizedBox();
    if (childView == null) {
      current = Container(
        color: backGroundColor == null ? Colors.white : Color(backGroundColor!),
        // padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top),
        child: Container(
          child: Stack(
            children: <Widget>[
              DecoratedBox(
                decoration: getBoxDecoration(context),
                child: Center(
                  child: Container(
                    padding: EdgeInsets.only(
                        top: MediaQuery.of(context).padding.top),
                    width: MediaQuery.of(context).size.width - 100,
                    child: Center(
                      child: Text(
                        title,
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: titleTextStyle ??
                          TextStyleTheme.getTextStyle(context: context, fontSize: 17)
                      ),
                    ),
                  ),
                ),
              ),
              Container(
                padding:
                EdgeInsets.only(top: MediaQuery.of(context).padding.top),
                child: Center(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      showLeftButton
                          ? IconButton(
                        onPressed: () {
                          if (callPopBack == null) {
                            if (Navigator.canPop(context)) {
                              Navigator.pop(context);
                            }
                          } else {
                            callPopBack?.call();
                          }
                        },
                        icon: SvgPicture.asset(
                          getNavigatorUrl(),
                          color: btnColor ?? Colors.black,
                          width: 20.0,
                          height: 20.0,
                        ),
                      )
                          : const SizedBox(),
                      getRightWidget(),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      );
    }
    return current;
  }

  /// 获取左边导航样式
  String getNavigatorUrl() {
    if (closeSvg != null && closeSvg!.length > 0) {
      return closeSvg!;
    }
    return 'assets/icons/ic_navigator_back.svg';
  }

  ///获取右边的按钮显示区域
  Widget getRightWidget() {
    if (rightWidget == null) {
      return const SizedBox();
    } else {
      return rightWidget!;
    }
  }

  Decoration getBoxDecoration(BuildContext context) {
    if (showBottomLine ?? true) {
      return BoxDecoration(
        color: backGroundColor == null
            ? ColorTheme.of(context).colorFFFFFF
            : Color(backGroundColor!),
        border: Border(
          bottom: BorderSide(
            width: 0.5,
            color: showBottomLine ?? true
                ? ColorTheme.of(context).colorFFFFFF!
                : const Color(0xffffffff),
          ),
        ),
      );
    } else {
      return const BoxDecoration();
    }
  }
}
